//
// Breadcrumb
//

// Bootstrap Overrides

.breadcrumb {
    border: $breadcrumb-border;
}


//
// Custom
//

// Size Variations

.breadcrumb-sm {
    font-size: $breadcrumb-font-size-sm;
}


.breadcrumb-links {
    border: 0;
    background-color: transparent;
    @include border-radius(0);

    .breadcrumb-item {

        // Separator

        + .breadcrumb-item::before {
            content: "";
            width: .3rem;
            height: .6rem;
            margin-right: $breadcrumb-item-padding;
            -webkit-mask: url() no-repeat 50% 50%;
            mask: url() no-repeat 50% 50%;
            -webkit-mask-size: contain;
            mask-size: contain;
            background: $breadcrumb-divider-color;
        }
    }
}

.breadcrumb-dark {
	.breadcrumb-item {
		a {
			color: rgba($white, .8);

			&:hover {
				color: rgba($white, 1);
			}
		}

        &.active {
            color: rgba($white, .6);
        }

		+ .breadcrumb-item {
	        &::before {
	            color: rgba($white, .8);
	        }
	    }
	}
}

.breadcrumb-light {
	.breadcrumb-item {
		a {
			color: rgba($dark, .8);

			&:hover {
				color: rgba($dark, 1);
			}
		}

		+.breadcrumb-item {
	        &::before {
	            color: rgba($dark, .8);
	        }
	    }
	}
}
